import { Form, Input, InputNumber, Button } from "antd";
import { useEffect } from "react";

export const GradingForm = ({ type, onSubmit, initialValues }) => {
  const [form] = Form.useForm();

  // Set initial values when component mounts or changes
  useEffect(() => {
    if (initialValues) {
      form.setFieldsValue(initialValues);
    }
  }, [initialValues, form]);

  return (
    <Form
      form={form}
      layout="vertical"
      onFinish={onSubmit}
      initialValues={initialValues}
    >
      {type === 1 ? (
        <>
          <Form.Item
            label="分数1"
            name="score1"
            rules={[{ required: true, message: '请输入分数1' }]}
          >
            <InputNumber min={0} max={100} style={{ width: '100%' }} />
          </Form.Item>
          <Form.Item
            label="分数2"
            name="score2"
            rules={[{ required: true, message: '请输入分数2' }]}
          >
            <InputNumber min={0} max={100} style={{ width: '100%' }} />
          </Form.Item>
        </>
      ) : (
        <Form.Item
          label="评价内容"
          name="appraise"
          rules={[{ required: true, message: '请输入评价内容' }]}
        >
          <Input.TextArea rows={4} />
        </Form.Item>
      )}

      <Form.Item>
        <Button type="primary" htmlType="submit">
          提交
        </Button>
      </Form.Item>
    </Form>
  );
};
